<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <script src="../org/angular.min.js"></script>
    <script src="../org/jquery.min.js"></script>
</head>
<body>

<div ng-app="hd">

    <!--使用A-->
    <div hdcms color="red">你好，后盾网！！</div>

</div>


<script>
    var m = angular.module('hd', []);

    /*hdcms是指令的名字，function中的代码，是构建指令的代码*/
    m.directive('hdcms', function () {
        //构建指令的代码
        return {
            restrict:'AEC',   //指生成指令在页面中的表现形式: A 是指attr  E 是指element C 是指class，不建议使用C
            template: function (elem, attr) { //第一个参数是元素，第二个参数是属性
                console.log($(elem).html());console.log(attr);
                return "<span style='color:"+ attr['color']+"'>"+$(elem).html() + "</span>";
            }
        }
    });
</script>


</body>
</html>

